<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>使用ztree展示content_category</title>

<link rel="stylesheet" href="/static/css/zTreeStyle/zTreeStyle.css"
	type="text/css">

</head>
<body>
<form action="/selectedCategory" method="post">
选择你要的分类:
		<input type="text" name="contentCategory" />
		<input type="hidden" name="id" />
		<input type="submit" value="提交"/>
</form>
	

	<ul id="myTree" class="ztree"></ul>
	<input type="button" value="确认" id="refreshNode" />
	<script type="text/javascript" src="/static/js/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="/static/js/jquery.ztree.core.js"></script>
	<script type="text/javascript">
		var setting = {
			view : {
				selectedMulti : false
			//只能单选
			},
			async : {
				enable : true,
				url : "/myTree",
				autoParam : [ "id" ],

			}
		};

		function refreshNode(e) {
			var zTree = $.fn.zTree.getZTreeObj("myTree"); 
			 var nodes = zTree .getSelectedNodes();
			if (nodes.length == 0) {
				alert("请先选择一个父节点");
			}else{
				//alert(nodes[0].id+"--"+nodes[0].name);
				 $("input[name='contentCategory']").val(nodes[0].name); 
				 $("input[name='id']").val(nodes[0].id); 
			}
			 
		}

		$(document).ready(function() {
			$.fn.zTree.init($("#myTree"), setting);
			//为确定按钮绑定事件
			$("#refreshNode").bind("click", refreshNode);
		})
	</script>
</body>
</html>